<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <title>配送订单详情</title>
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui-pull-refresh.css" />
    <link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="./css/headersearch.css" />
    <link rel="stylesheet" type="text/css" href="css/comm.css" />
    <link rel="stylesheet" type="text/css" href="css/qualitycontrollist.css" />
    <link rel="stylesheet" type="text/css" href="css/distribution_center.css" />
    <style>
        .new-btn-bottom {
            width: 92%;
            margin: 40px auto;
        }

        .new-blue-btn {
            height: 44px;
            line-height: 44px;
            box-shadow: 0px 12px 24px 0px rgb(49 127 203 / 32%);
        }

        .sp-more {
            width: 100%;
            text-align: center;
            color: #999;
            margin-top: 15px;
        }

        .sp-more label i {
            color: #aaa;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <section class="aui-content">
            <div v-if="form.id!=undefined">
                <div class=" boxarea mainbox">
                    <div class="work_con_box">
                        <div class="work_con_box_type pb10 border-bottom">
                            <div><span class="left-blue-span"
                                    v-bind:class="{'left-gree-span':form.status==4||form.status==5||form.status==6,'left-org-span':form.status<4,'left-blu-span':form.deliveryType==3}">{{form.statusDesc}}</span>
                            </div>
                        </div>

                        <div class="work_con_box_time marginheight border-bottom">
                            <ul class="processul">
                                <li class="processulli li-border-color-grey " v-bind:class="{'bg-grey':form.status>=5||form.deliveryType==3}">
                                    <div class="icon_type">起</div>
                                    <div class="task_process_con con_right">
                                        <div class="handle">
                                            <div class="task_process_basic_title">
                                                <div class="task_process_basic_title_name fl" v-bind:class="{'sort':form.deliveryType==1}">
                                                    <div class="fl">{{form.fromAddress}}</div>
                                                    <div class="cl"></div>
                                                </div>
                                                <div v-if="form.deliveryType==1" v-on:click="tellCallPhone(form.customerPhone)"
                                                    class="order_right_phone fr">
                                                    <div><label class="icon-callphone"><i
                                                                class="icon iconfont icon-dianhua"></i></label></div>
                                                    <div class="lianxi-right">联系顾客</div>
                                                </div>
                                                <div class="cl"></div>
                                                <div v-if="form.deliveryType==1" class="handle_con_msg ">
                                                    <span>{{form.customerName}}</span>
                                                    <span>{{form.customerPhone}}</span>
                                                </div>
                                                <div v-if="form.deliveryType==2||form.deliveryType==3" class="hide_height"></div>
                                                <div class="cl"></div>
                                            </div>
                                        </div>
                                        <div class="hide_height"></div>
                                    </div>
                                </li>
                                <li class="processulli" v-bind:class="{'bg-grey':form.deliveryType==1}">
                                    <div class="icon_type">终</div>
                                    <div class="task_process_con con_right">
                                        <div class="handle">
                                            <div class="task_process_basic_title">
                                                <div class="task_process_basic_title_name fl" v-bind:class="{'sort':form.deliveryType==2||form.deliveryType==3}">
                                                    <div class="fl ">{{form.toAddress}}</div>
                                                    <div class="cl"></div>
                                                </div>
                                                <div v-if="form.deliveryType==2||form.deliveryType==3"
                                                    v-on:click="tellCallPhone(form.customerPhone)"
                                                    class="order_right_phone fr">
                                                    <div><label class="icon-callphone"><i
                                                                class="icon iconfont icon-dianhua"></i></label> </div>
                                                    <div class="lianxi-right">联系顾客</div>
                                                </div>
                                                <div class="cl"></div>
                                                <div v-if="form.deliveryType==2||form.deliveryType==3" class="handle_con_msg ">
                                                    <span>{{form.customerName}}</span>
                                                    <span>{{form.customerPhone}}</span>
                                                </div>
                                                <div v-if="form.deliveryType==1" class="hide_height"></div>
                                                <div class="cl"></div>
                                            </div>
                                        </div>
                                        <div class="hide_height"></div>
                                    </div>
                                </li>
                            </ul>
                        </div>

                        <div v-if="form.appointTime" class="work_con_box_time marginheight">
                            <div class="work_con_box_left"><i class="icon iconfont icon-shijian"></i>预约时间:</div>
                            <div class="work_con_box_right">
                                <label>
                                    <span class="text-blue li24">{{form.appointTime}}</span>送达
                                    <span v-if="form.isTimingOut" class="label-btn-red">{{form.isTimingOut}}</span>
                                </label>
                            </div>
                        </div>
                        <div v-if="form.goodWeight" class="work_con_box_time marginheight">
                            <div class="work_con_box_left"><i class="icon iconfont icon-rili"></i>预计重量:</div>
                            <div class="work_con_box_right">
                                <label class="li24"><span class="text-blue">{{form.goodWeight}}</span>kg</label>
                            </div>
                        </div>

                        <div v-if="form.remark&&form.deliveryType!=3" class="work_con_box_time marginheight">
                            <div class="div-text-remark">
                                备注：{{form.remark}}
                            </div>
                        </div>

                        <div v-if="form.acceptTime" v-on:click="do_open(item)" class="work_con_box_time marginheight">
                            <div class="work_con_box_left"><i class="icon iconfont icon-shijian"></i>接单时间:</div>
                            <div class="work_con_box_right">
                                <label class="li24">{{form.acceptTime}}</label>
                            </div>
                        </div>
                        <div v-if="form.completeTime" class="work_con_box_time marginheight">
                            <div class="work_con_box_left"><i class="icon iconfont icon-rili"></i>完成时间:</div>
                            <div class="work_con_box_right">
                                <label class="li24">{{form.completeTime}}</label>
                            </div>
                        </div>
                    </div>
                </div>

                <div v-if="form.orderItemList!=undefined&&form.orderItemList.length>0" class="boxarea mainbox">
                    <div class="app_list_txt" style="display: flex;">
                        <span>商品信息</span>
                        <div class="user-div-time">
                            <label class="user-label-time">共{{form.orderItemCount}}件</label>
                        </div>
                    </div>
                    <div class="user-header">
                        <div v-if="index<5" class="user-content" v-for="(item,index) in form.orderItemList"
                            v-bind:class="{'border-bottom':index<form.orderItemList.length-1}">
                            <div class="box_wrapper" style="width:60px;">
                                <img v-on:click="do_viewimages(index)" v-if="item.itemCoverImg" class="box_image"
                                    :src="item.itemCoverImg">
                                <img v-if="!item.itemCoverImg" class="box_image" src="../image/default.png">
                            </div>
                            <div class="box_wrapper">
                                <div class="sta-list">
                                    <div class="sta-title">
                                        {{item.itemName}}
                                    </div>
                                    <div class="sta-count">
                                        X {{item.itemQty}}
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div v-if="index>=5&&IsShowMore" class="user-content" v-for="(item,index) in form.orderItemList"
                            v-bind:class="{'border-bottom':index<form.orderItemList.length-1}">
                            <div class="box_wrapper" style="width:60px;">
                                <img v-on:click="do_viewimages(index)" v-if="item.itemCoverImg" class="box_image"
                                    :src="item.itemCoverImg">
                                <img v-if="!item.itemCoverImg" class="box_image" src="../image/default.png">
                            </div>
                            <div class="box_wrapper">
                                <div class="sta-list">
                                    <div class="sta-title">
                                        {{item.itemName}}
                                    </div>
                                    <div class="sta-count">
                                        X {{item.itemQty}}
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div v-if="form.orderItemList.length>5" class="sp-more">
                            <label v-if="IsShowMore==false" v-on:click="doshowmore()">查看更多 <i
                                    class="icon iconfont icon-down"></i></label>
                            <label v-if="IsShowMore==true" v-on:click="doshowmore()"> 收起 <i
                                    class="icon iconfont icon-shangjiantou"></i></label>
                        </div>

                    </div>
                </div>
                <div v-if="form.deliveryType==3" class="boxarea mainbox">
                    <div class="app_list_txt" style="display: flex;">
                        <span>待取快递</span>
                    </div>
                    <div class="user-header">
                        <div style="margin-top: 5px; font-size: 0.7rem;">{{form.remark}}</div>
                        <div v-if="form.orderItemList.length>0" class="work_con_box_time marginheight">
                            <div v-if="itemIndex<5" v-for="(itemImg,itemIndex) in form.orderItemList" class="work-box-image">
                                <img :src="itemImg.itemCoverImg" />
                            </div>
                            <div v-if="form.orderItemList.length>5" class="work-box-last">
                                <div class="work-box-text">共{{form.orderItemList.length}}类 <i class="icon iconfont icon-xiangyoujiantou"></i></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="new-btn-bottom">
                <div v-if="(form.status==1||form.status==5)&&form.canGet" class="new-blue-btn" v-on:click="doOrderReceiveSave()">接单
                </div>
                <!-- <div class="new-blue-btn new-white-btn" v-on:click="doOrderService(1)">退回</div> -->
                <div v-if="form.status==3" class="new-blue-btn" v-on:click="doOrderService()">配送完成</div>
                <div v-if="form.status==2" class="new-blue-btn" v-on:click="doOrderCheck(0)">验收取货</div>
            </div>
        </section>
    </div>
</body>
<script type="text/javascript " src="../script/api.js "></script>
<script type="text/javascript " src="../script/vue.js "></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/aui-toast.js"></script>
<script type="text/javascript" src="../script/aui-tab.js"></script>
<script type="text/javascript" src="../script/aui-slide.js"></script>
<script type="text/javascript" src="../script/aui-popup.js"></script>
<script type="text/javascript " src="js/distribution_center_detail.js"></script>

</html>